$color1: #0084ff;
$color2: #ff0000;
$color3: #009900;
$color4: #666666;
@mixin lg_badge {
    display: inline-block;
    box-sizing: border-box;
    text-align: center;
    vertical-align: middle;
}
.lg_badge_A {
    @include lg_badge;
    width: 108px;
	height: 40px;
	border-radius: 4px;
	border: solid 2px #0096ff;
    font-size: 24px;
	line-height: 40px;
	color: $color1;
}
@mixin lg_badge_color_A($c1) {
    border-color: $c1;
    color: $c1;
}
.lg_badge_color_A2 {
    @include lg_badge_color_A($color2);
}
.lg_badge_color_A3 {
    @include lg_badge_color_A($color3);
}
.lg_badge_color_A4 {
    @include lg_badge_color_A($color4);
}


@mixin lg_badge_color_B($c1, $c2) {
    background-color: $c1;
    color: $c2;
}
.lg_badge_B {
    @include lg_badge;
    width: 108px;
	height: 40px;
    font-size: 24px;
    line-height: 42px;
	border-radius: 4px;
    @include lg_badge_color_B(rgba(0, 150, 255, 0.2), $color1);
}
.lg_badge_color_B2 {
    @include lg_badge_color_B(rgba(255, 0, 0, 0.2), $color2);
}
.lg_badge_color_B3 {
    @include lg_badge_color_B(rgba(0, 153, 0, 0.2), $color3);
}
.lg_badge_color_B4 {
    @include lg_badge_color_B(rgba(102, 102, 102, 0.2), $color4);
}

@mixin lg_badge_color_B1($c1) {
    background-color: $c1;
}
.lg_badge_B1 {
    @include lg_badge;
    width: 101px;
	height: 34px;
    line-height: 36px;
    font-size: 18px;
	@include lg_badge_color_B1($color1);
    color: #fff;
	border-radius: 10px 10px 10px 0px;
}
.lg_badge_color_B12 {
	@include lg_badge_color_B1($color2);
}
.lg_badge_color_B13 {
	@include lg_badge_color_B1($color3);
}
.lg_badge_color_B14 {
	@include lg_badge_color_B1($color4);
}

@mixin lg_badge_color_C($img) {
    background-image: url($img);
}
.lg_badge_C {
    width: 152px;
	height: 154px;
    color: #fff;
    font-size: 26px;
    line-height: 116px;
    text-align: center;
    background: url("images/icon0.svg") center center/100% 100%;
}
.lg_badge_color_C2 {
    @include lg_badge_color_C("images/icon1.svg");
}
.lg_badge_color_C3 {
    @include lg_badge_color_C("images/icon2.svg");
}
.lg_badge_color_C4 {
    @include lg_badge_color_C("images/icon3.svg");
}
.lg_badge_color_C5 {
    @include lg_badge_color_C("images/icon4.svg");
}
.lg_badge_C > .lg_badge_sub {
    width: 100%;
    margin-left: -10%;
    transform: rotate(-46deg);
}

$color_d1: rgba(0, 132, 255, 0.4);
$color_d2: rgba(255, 0, 0, 0.4);
$color_d3: rgba(0, 153, 0, 0.4);
$color_d4: rgba(102, 102, 102, 0.4);
.lg_badge_D {
    box-sizing: border-box;
    width: 134px;
	height: 134px;
    padding: 12px;
	border: solid 5px $color_d1;
    border-radius: 50%;
    vertical-align: middle;
    transform: rotate(-30deg);
}
.lg_badge_sub_warp {
    box-sizing: border-box;
    margin: auto;
    width: 100%;
	height: 100%;
}
.lg_badge_d_line {
    position: relative;
    height: 30%;
    width: 100%;
    overflow: hidden;
}
.lg_badge_d_top, .lg_badge_d_bottom {
    box-sizing: border-box;
    position: absolute;
    width: 100px;
    height: 100px;
	border: solid 2px $color_d1;
    border-radius: 50%;
}
.lg_badge_d_top {
    top: 0;
}
.lg_badge_d_bottom {
    bottom: 0;
}
.lg_badge_d_sub {
    height: 40%;
    width: 120px;
    margin-left: -10px;
    line-height: 40px;
    font-size: 32px;
    text-align: center;
    color: $color_d1;
}
@mixin lg_badge_color_D($c1) {
    .lg_badge_d_top, .lg_badge_d_bottom {
        border-color:$c1;
    }
    .lg_badge_d_sub {
        color: $c1;
    }
    border-color: $c1;
}
.lg_badge_color_D2 {
    @include lg_badge_color_D($color_d2)
}
.lg_badge_color_D3 {
    @include lg_badge_color_D($color_d3)
}
.lg_badge_color_D4 {
    @include lg_badge_color_D($color_d4)
}